<template>
		<view class = "login">
		<view class="backTomine" @tap = "backTomine">
			返回
		</view>
			<image class = "image" src="../../../assets/images/leju-logo.png" mode=""></image>
			
			<view class="mobile">
					<view class="imgs">
						<image src="../../../assets/images/mine.png" mode=""></image>
					</view>
					<view class="">
						<input v-model = "username" type="text" placeholder="请输入手机号" />
					</view>
				</view>
				
				<view class="keyword">
					<view class="imgs">
						<image src="../../../assets/images/mine.png" mode=""></image>
					</view>
					<view class="">
						<input v-model = "password" type="text" placeholder="请输入密码" />
					</view>
				</view>
				
				<view class="logins" @tap = "loginTomine">
					登录
				</view>
				
				<view class="footer">
					<text @tap = "toEnroll">注册</text>
					<text @tap = "repassword">忘记密码</text>
				</view>
			
		</view>
	
	
</template>

<script>
	import  http  from "../../../utils/http.js"
	export default {
		data() {
			return {
				username:"",
				password:''
			}
		},
		methods:{
			backTomine(){
				uni.switchTab({
					url:"/pages/mine/mine"
				})
			},
			toEnroll(){
				uni.navigateTo({
					url:"/pages/mine/enroll/enroll"
				})
			},
			repassword(){
				uni.navigateTo({
					url:"./repassword/repassword"
				})
			},
			loginTomine(){
				http.post("/api/leju/front/user/doLogin",{
					username:this.username,
					password:this.password
				}).then(res => {
					console.log(res);
					if(res.data.code == "S"){
						uni.setStorageSync("token",JSON.stringify(res.data.data));
						uni.showToast({
							title:"登录成功"
						})
						setTimeout(() =>{
							uni.switchTab({
								url:"/pages/mine/mine"
							})
						},1000)
					}
				})
				
			},
		}
	}
</script>

<style lang="scss" scoped>
	.login{
		width:750rpx;
		height: 100vh;
		background-color:wheat;
		padding:0.1rpx;
		.backTomine{
			margin:10px;
			font-weight:bolder;
		}
		.image{
			width:212rpx;
			height: 212rpx;
			margin:154rpx 270rpx 186rpx 268rpx;
			border-radius:50%;
		}
		.mobile{
			width:536rpx;
			height: 78rpx;
			margin-left:108rpx;
			margin-bottom:36rpx;
			border-radius:20rpx;
			display:flex;
			justify-content: space-around;
			align-items:center;
			border:1px black solid;
			.imgs{
				width:30rpx;
				height: 30rpx;
				margin-left:26rpx;
				image{
					width:100%;
					height: 100%;
				}
			}
		}
		.keyword{
			width:536rpx;
			height: 78rpx;
			margin-left:108rpx;
			margin-bottom:48rpx;
			border-radius:20rpx;
			display:flex;
			justify-content: space-around;
			align-items:center;
			border:1px black solid;
			.imgs{
				width:30rpx;
				height: 30rpx;
				margin-left:26rpx;
				image{
					width:100%;
					height: 100%;
				}
			}
		}
		.logins{
			width:536rpx;
			height: 94rpx;
			margin-left:108rpx;
			background: #354E44;
			border-radius: 14rpx;
			margin-bottom:48rpx;
			border-radius:20rpx;
			display:flex;
			justify-content: space-around;
			align-items:center;
			border:1rpx black solid;
			font-size: 30rpx;
			color: #FFFFFF;
			letter-spacing: 2.14rpx;
			font-weight: bolder;
			}
		}
		.footer{
			width:536rpx;
			display:flex;
			justify-content: space-between;
			margin-left:108rpx;
		}
			
	
	
</style>
